<script setup lang="ts">

import {ref} from 'vue'
import {RouterLink, RouterView} from 'vue-router'

const activeIndex = ref('1')
</script>

<template>

  <el-menu
      :default-active="activeIndex"
      class="el-menu-demo"
      mode="horizontal"
      :ellipsis="false"
      router
  >
    <el-menu-item index="0">LOGO</el-menu-item>
    <el-menu-item index="/">首页</el-menu-item>
    <el-menu-item index="my">我的</el-menu-item>
    <el-menu-item index="shopCar">购物车</el-menu-item>
    <el-menu-item index="category">分类页面</el-menu-item>
  </el-menu>
</template>

<style scoped>

.el-menu-demo {
  display: flex;
  justify-content: space-between;
}

.el-menu--horizontal > .el-menu-item:nth-child(1) {
  margin-right: auto;
}
</style>